<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../../css/mui.min.css" rel="stylesheet" />
	</head>
	<style>
		.oa-contact-cell.mui-table .mui-table-cell {
			padding: 11px 0;
			vertical-align: middle;
		}
		
		.oa-contact-cell {
			position: relative;
			margin: -11px 0;
		}
		
		.oa-contact-avatar {
			width: 75px;
		}
		
		.oa-contact-name,
		oa-contact-position {
			float: left;
		}
		
		img {
			width: 55%;
		}
		
		p {
			text-indent: 22px;
		}
		
		.mui-popover {
			height: 300px;
		}
		
		.mui-content {
			padding: 10px;
		}
		
		li {
			background: #FFFFFF;
		}
		
		a {
			color: black;
		}
		
		.x {
			top: -10px;
		}
		/*.mui-card-content-inner {
			height: 60px;
		}*/
		.mui-card{
			margin: 3px;
		}
	</style>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-back  mui-icon-backmui-pull-left"></a>
			<h1 class="mui-title">基本资料</h1>
		</header>

		<div class="mui-content">
			<ul class="mui-table-view mui-table-view-striped mui-table-view-condensed">
				<li class="mui-table-view-cell" id="1">
					<div class="mui-slider-cell">
						<div class="oa-contact-cell mui-table">
							<div class="oa-contact-avatar mui-table-cell mui-hidden">
								<img src="../../../images/headImg/mengzhang.png" />
							</div>
							<div class="oa-contact-content mui-table-cell">
								<div class="mui-clearfix">
									<h4 class="oa-contact-name">
										<span id="userName">客户名</span>
									</h4>
									<span class="oa-contact-position mui-h6">
										<span id="companyName" style="margin-left: 20px;">公司名</span>
									</span>
								</div>
								<p class="oa-contact-email mui-h6">
									<div>
										<h6>联系方式：
											<span id="cPhone"></span>
										</h6>
									</div>
								</p>
							</div>
						</div>
					</div>
				</li>
				<li class="mui-table-view-cell" id="update">
					<a class="mui-navigate-right" href="update.html">编辑资料</a>
				</li>
			</ul>
			<div class="content" style="margin-top: 5px;">
				<div class="mui-row">
					<div class="mui-col-xs-12 mui-col-sm-12" style="text-align: center; margin-top: 10px; padding: 0px;">
						<p>详细信息：</p>
					</div>
				</div>
				<div class="mui-row" style="margin-top: 10px;">
					<div class="mui-input-row ">
						<div class="mui-card">
							<label>公司地址：</label>
							<div class="mui-card-content">
								<div class="mui-card-content-inner">
									<span id="companyAddress" class="x"></span>
								</div>
							</div>
						</div>
					</div>
					<div class="mui-input-row ">
						<div class="mui-card">
							<label>联系人：</label>
							<div class="mui-card-content">
								<div class="mui-card-content-inner">
									<span id="contact" class="x"></span>
								</div>
							</div>
						</div>
					</div>
					<div class="mui-input-row ">
						<div class="mui-card">
							<label>QQ号码：</label>
							<div class="mui-card-content">
								<div class="mui-card-content-inner">
									<span id="qq" class="x"></span>
								</div>
							</div>
						</div>
					</div>
					<div class="mui-input-row ">
						<div class="mui-card">
							<label>微信号码：</label>
							<div class="mui-card-content">
								<div class="mui-card-content-inner">
									<span id="weichat" class="x"></span>
								</div>
							</div>
						</div>
					</div>
					<div class="mui-input-row " style="padding: 0px;">
						<div class="mui-card">
							<label>邮件地址：</label>
							<div class="mui-card-content">
								<div class="mui-card-content-inner">
									<span id="email" class="x"></span>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<script src="../../../js/mui.min.js"></script>
			<script src="../../../js/myjs/localVarchar.js"></script>
			<script src="../../../js/ipjs/ip.js"></script>
			<script src="../../../js/constatnt/var.js"></script>
			<script type="text/javascript">
				mui.init();
				mui(".mui-table-view").on('tap', "li", function() {
					document.getElementById(this.getAttribute("id")).style.backgroundColor = "#FFFFFF";
				})
				document.getElementById("update").addEventListener('tap', function() {
					mui.openWindow({
						url: "update.html"
					});
				});
				mui.ajax(ip + '/userInfo/getUserInfo/' + localStorage.getItem(LOCAL_USER_INFO), {
					type: 'get',
					timeout: 10000,
					headers: {
						'Content-Type': 'application/json'
					},
					success: function(data) {
						//服务器返回响应，根据响应结果，分析是否登录成功；
						if(data.status == OPERATION_SUCCESS) {
							document.getElementById("userName").innerHTML = data.data.name == "" ? "" : data.data.name;
							document.getElementById("companyName").innerHTML = data.data.companyName == "" ? "" : data.data.companyName;
							document.getElementById("cPhone").innerHTML = data.data.phone;
							document.getElementById("companyAddress").innerHTML = data.data.companyAddress == "\"\"" ? "" : data.data.companyAddress;
							document.getElementById("contact").innerHTML = data.data.contactPhone == "\"\"" ? "" : data.data.contactPhone;
							document.getElementById("qq").innerHTML = data.data.qq == 0 ? "" : data.data.qq;
							document.getElementById("weichat").innerHTML = data.data.wechat == "\"\"" ? "" : data.data.wechat;
							document.getElementById("email").innerHTML = data.data.email == "\"\"" ? "" : data.data.email;
						}
					},
					error: function(xhr, type, errorThrown) {
						//异常处理；
						mui.toast("系统异常！");
					}
				});
			</script>
	</body>

</html>